// pages/EchartsPrints/DDPie/DDPie.js
import * as echarts from '../../../ec-canvas/echarts.js';
const app = getApp();
let chart = null;
let pageInstance = {}
var option = {
  tooltip: {
    triggerOn: "click",
    formatter: function (e, t, n) {
      pageInstance.BindEvent(e);//锚定
      return e.name + '\n'+'感染:' + e.value +'\n'+'治愈:'+e.data.cure
    }
  },
  backgroundColor: "#ffffff",
  color: ["#37A2DA", "#32C5E9", "#67E0E3", "#91F2DE", "#FFDB5C", "#FF9F7F"],
  series: [{
    label: {
      normal: {
        fontSize: 14
      }
    },
    type: 'pie',
    center: ['50%', '50%'],
    radius: [0, '60%'],
    data: [{
      value: 55,
      name: 'A市',
      cure: 33
    }, {
      value: 20,
      name: 'B市',
      cure: 10
    }, {
      value: 10,
      name: 'C市',
      cure: 2
    }, {
      value: 20,
      name: 'D市',
      cure: 15
    }, {
      value: 38,
      name: 'E市',
      cure: 18
    },
    ],
    itemStyle: {
      emphasis: {
        shadowBlur: 10,
        shadowOffsetX: 0,
        shadowColor: 'rgba(0, 2, 2, 0.3)'
      }
    }
  }]
};
function initChart(canvas, width, height) {
  chart = echarts.init(canvas, null, {
    width: width,
    height: height
  });
  canvas.setChart(chart);
  

  chart.setOption(option);
  return chart;
}
Component({
  /**
   * 组件的属性列表
   */
  options: {
    addGlobalClass: true,
    multipleSlots: true
  },
  properties: {
    region:{
      type:String,
      value:'省',
      observer: function(newVal, oldVal) {
        // 属性值变化时执行,更新饼状图 写在此部分
        //console.log('省份更新为' + newVal)
      }
    },
    citycounts:{
      type:Array,
      observer: function(newVal, oldVal) {
        var len = newVal.length;
        for(var i = 0; i < len; i++){
          newVal[i].value = newVal[i].conNum
          newVal[i].cure = newVal[i].cureNum
        }
        option.series[0].data = newVal
        //console.log(newVal)
        if(len!=0){
          chart.setOption(option)
        }
      
        //chart.setOption()
        //this.echartInit()
      }
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    ec: {
      onInit: initChart
    },
    citylist:[]
  },
  lifetimes: {
    created: function () {
       pageInstance = this;
    }
  },
  /**
   * 组件的方法列表
   */
  methods: {
    BindEvent(e){
      console.log('饼状图点击')
      //console.log(e)
      //点击饼状图区域进行操作部分 写在该部分
    },
    echartInit (e) {
      console.log(e)
      initChart(e.detail.canvas, e.detail.width, e.detail.height);
    }
  }
})
